<template>
  <div>
    <!-- <a href="tel:15890152837" class="callphone">我能拨号</a>
    <div class="call" @click="callPhone">点我点我(原生方法)</div> -->
    <button @click="weak">点击</button>
    <home-header></home-header>
    <home-swiper :swiperList="swiperList"></home-swiper>
    <home-icons :iconList="iconList"></home-icons>
    <home-recommend :recommendList="recommendList"></home-recommend>
    <home-weekend :weekendList="weekendList"></home-weekend>
    <img style="-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;" src="{$shareloan}" width="90%" id="testImg">
    <span id="saveImg" @click="save" style="margin-bottom:.6rem;margin-top:.6rem;">保存图片</span>
  </div>
</template>

<script>
import HomeHeader from './components/Header'
import HomeSwiper from './components/Swiper'
import HomeIcons from './components/Icons'
import HomeRecommend from './components/Recommend'
import HomeWeekend from './components/Weekend'
import axios from 'axios'
import Qs from 'qs'
import { mapState } from 'vuex'
export default {
  name: 'Home',
  components: {
    HomeHeader: HomeHeader,
    HomeSwiper: HomeSwiper,
    HomeIcons: HomeIcons,
    HomeRecommend: HomeRecommend,
    HomeWeekend: HomeWeekend
  },
  data () {
    return {
      swiperList: [],
      iconList: [],
      recommendList: [],
      weekendList: [],
      lastCity: ''
    }
  },
  methods: {
    save() {
      var img = document.getElementById("testImg");

      var alink = document.createElement("a");

      alink.href = img.src;

      alink.click();
    },
    weak() {
      var locatUrl = "weixin://";
      if (/ipad|iphone|mac/i.test(navigator.userAgent)) {
        var ifr = document.createElement("iframe");
        ifr.src = locatUrl;
        ifr.style.display = "none";
        console.log(1)
        document.body.appendChild(ifr);
      } else {
        window.location.href = locatUrl;
        console.log(2)
      }
    },
    getHomeInfo () {
      axios.get('/api/index.json?city=' + this.city).then(this.getHomeInfoSuccess)
    
      axios({
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
        },
        transformRequest: [function(data) {      //在请求之前对data传参进行格式转换
          data = Qs.stringify(data)
          return data
        }],
        method: 'post',
        url: '/open/login',
        data: {
          username: '15890152837',
          pwd: '111111',
          code: '1'
        }
      }).then(res => {
        console.log(res)
      })
    },
    getHomeInfoSuccess (res) {
      res = res.data
      if (res.ret && res.data) {
        this.swiperList = res.data.swiperList
        this.iconList = res.data.iconList
        this.recommendList = res.data.recommendList
        this.weekendList = res.data.weekendList
      }
    },
    callPhone() {
      var num = "15890152837"
      var u = navigator.userAgent;
      var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
      var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
      if(isAndroid) {
          window.WebContrl.callPhone(num)
      }
    }
  },
  mounted () {
    // 页面挂载完成就去请求数据
    this.lastCity = this.city
    this.getHomeInfo()
  },
  computed: {
    ...mapState(['city'])
  },
  activated () {
    // 当页面重新显示时执行
    if (this.lastCity !== this.city) {
      this.lastCity = this.city
      this.getHomeInfo()
    }
  }
}
</script>

<style>
.callphone{
  display:block;
  line-height:2;
  margin-bottom: .5rem;
  border-bottom:.1rem solid #e2e2e2;
}
.call{
  line-height:2;
  cursor: pointer;
}
</style>
